<template>
    <div>
      <el-form
        :model="ruleForm"
        :rules="rules"
        ref="ruleForm"
        label-width="100px"
        class="demo-ruleForm"
      >
  
  
        <el-form-item label="章节标题" prop="name">
          <el-input v-model="ruleForm.name"></el-input>
        </el-form-item>
  
  
          <el-form-item label="第几节" prop="name">
          <el-input v-model="ruleForm.tcount"></el-input>
        </el-form-item>
  
  
        <el-form-item label="图片" prop="pic">
          <el-upload
            class="avatar-uploader"
            action="#"
            :before-upload="upload"
           
          >
            <el-button slot="trigger">上传视频</el-button>
          </el-upload>
          
        </el-form-item>
        <el-form-item label="课程" prop="pic">
          <select name="" id=""  v-model="ruleForm.courseid">
              <option :value="i.id" v-for="(i, index) in tags" :key="index">{{i.name}}</option>
          </select>
  
        </el-form-item>
  
        
       
     
  
        <el-form-item>
          <el-button type="primary" 
          @click="addjiejie"
            >立即创建</el-button
          >
          <el-button>重置</el-button>
        </el-form-item>
      </el-form>
      {{ruleForm}}
    </div>
  </template>
  
  <script>
  export default {
    data() {
      return {
        tags: [],
        ruleForm: {
          name:"",
          url:"",
          tcount:'',
          courseid:""
  
        },
        
      };
    },
    methods: {
      addjiejie(){
          this.axios.post("course/addjie", this.ruleForm).then((res) => {
              alert(res.data.mes)
          })
      },
      getcourse(){
          this.axios.get("course/get_course").then((res) => {
              this.tags = res.data.list
          })
      },
      upload(file){
          var data = new FormData()
          data.append("file", file)
          this.axios.post("course/upload", data).then((res) => {
              this.ruleForm.url = res.data.url
          })
      }
    
    },
    mounted() {
      this.getcourse()
    }
  }
  </script>
  
  <style>
   .el-dropdown-link {
      cursor: pointer;
      color: #409EFF;
    }
    .el-icon-arrow-down {
      font-size: 12px;
    }
  </style>